
import { Library, LibraryRecord } from "../../../../core/library";
import SerializeAble, { Serialize, SerializeClass } from "../../../../core/serialize";
import { SubjectComponent } from "../../../../core/subject";
import { Sync, Random } from "../../../../core/utils";
import QuickTalkItem from "./quick_talk_item";

const { ccclass, property } = cc._decorator;

@SerializeClass("QuickTalkItemConfig")
export class QuickTalkItemConfig extends SerializeAble {
    @Serialize()
    key: string = "";
    @Serialize()
    contents: string[] = [];
    @Serialize()
    color = "";
    @Serialize()
    face = "";
}

@SerializeClass("QuickTalkConfig")
export class QuickTalkConfig extends LibraryRecord {
    @Serialize()
    color = "#FFFFFF";
    @Serialize(QuickTalkItemConfig)
    items: QuickTalkItemConfig[] = [];
};

@ccclass
export default class QuickTalk extends SubjectComponent {
    @property(cc.Node)
    root: cc.Node = null;

    @property(cc.SpriteAtlas)
    faceAtlas: cc.SpriteAtlas = null;

    @property(cc.Prefab)
    itemPrefab: cc.Prefab = null;

    conf: QuickTalkConfig = null;

    items: QuickTalkItem[] = [];
    setData(conf: QuickTalkConfig) {
        this.conf = conf;

        let pt = cc.v2(0, 450);
        let list = this.conf.items;
        let count = list.length;
        let degInc = -360 / count;

        let time = 0;
        let timeInc = 0.025;
        let bgCol = new cc.Color();
        bgCol.fromHEX(this.conf.color);
        list.forEach((itemConf, ind) => {
            let key: string = itemConf.key;
            let item = cc.instantiate(this.itemPrefab).getComponent(QuickTalkItem);
            item.lbHotKey.string = `${ind + 1}`;
            item.lb.string = key;
            if (itemConf.face) {
                item.face.spriteFrame = this.faceAtlas.getSpriteFrame(itemConf.face);
            }
            item.on("click", this.onClickItem, this);
            if (itemConf.color) {
                item.bubble.color = cc.color().fromHEX(itemConf.color);
            }
            else {
                item.bubble.color = bgCol;
            }

            item.node.setPosition(pt);
            item.node.y *= 0.6;
            pt = pt.rotate(cc.misc.degreesToRadians(degInc));
            this.items.push(item);

            Sync.DelayTime(time).then(() => {
                if (cc.isValid(this)) {
                    this.node.addChild(item.node);
                    item.node.scale = 0;
                    cc.tween(item.node).to(0.05, { scale: 1 }, { easing: "backOut" }).start();
                }
            });
            time += timeInc;
        });
    }

    protected onLoad(): void {
        cc.systemEvent.on(cc.SystemEvent.EventType.KEY_DOWN, this.onKeyDown, this);
    }

    protected onDestroy(): void {
        cc.systemEvent.off(cc.SystemEvent.EventType.KEY_DOWN, this.onKeyDown, this);
    }
    onKeyDown(evt: cc.Event.EventKeyboard) {
        //0-48
        //9-57
        if (evt.keyCode >= 48 && evt.keyCode <= 57) {
            let ind = evt.keyCode - 49;
            if (ind === -1) {
                ind = 9;
            }
            if (this.items[ind]) {
                this.clickItem(this.items[ind].lb.string);
            }
        }
    }
    clickItem(key: string) {
        let itemConf = this.conf.items.find(ele => ele.key === key);
        this.emit("talk", itemConf);
        this.node.destroy();
    }
    onClickItem(key: string) {
        this.clickItem(key);
    }

    onClickClose() {
        this.node.destroy();
    }
}
